<template>
  <div>
    <!-- 面包屑导航区域 -->
    <el-breadcrumb separator-class="el-icon-arrow-right">
      <el-breadcrumb-item :to="{ path: '/home' }">首页</el-breadcrumb-item>
      <el-breadcrumb-item>工程项目列表</el-breadcrumb-item>
    </el-breadcrumb>

    <!-- 卡片视图 -->
    <el-card>
      <!-- 添加任务按钮区域 -->
      <el-row>

      </el-row>
      <!-- 添加任务按钮区域 -->
      <el-row>
        <el-col>
          <el-select v-model="queryInfo.year" placeholder="请选择" clearable style="padding-right: 10px; width: 80px;">
            <el-option v-for="item in yearlist" :key="item.value" :label="item.label" :value="item.value"></el-option>
          </el-select>
          <el-input v-model="queryInfo.serialno" placeholder="序号" style="width: 200px; padding-right: 10px;"></el-input>
          <!-- <el-select v-model="queryInfo.year" placeholder="请选择" clearable style="padding-right: 10px; width: 80px;">
            <el-option v-for="item in arealist" :key="item.value" :label="item.label" :value="item.value"></el-option>
          </el-select> -->
          <el-input v-model="queryInfo.projectname" placeholder="项目名称" style="width: 200px; padding-right: 10px;"></el-input>
          <el-input v-model="queryInfo.mobileprojectno" placeholder="移动项目编号" style="width: 200px; padding-right: 10px;"></el-input>
          <el-button type="primary" @click="getProjectsList">查询工程项目</el-button>
          <el-button size="mini" type="primary" @click="addProject" style="float: right">添加项目</el-button>
          <el-button size="mini" type="primary" @click="importdata" style="float: right">导入项目数据</el-button>
          <el-button size="mini" type="primary" @click="importdata2" style="float: right">导入移动计提表</el-button>
          <!-- <el-button type="primary" @click="addTeskDialogVisible = true" style="position: absolute;right:0px;">添加项目</el-button> -->
        </el-col>
      </el-row>
      <!-- 任务列表区域 -->
      <el-table :data="projectlist" border stripe :header-cell-style="{background:'#F5F7FA'}" max-height="430">
        <!-- 展开列 -->
        <el-table-column type="expand" fixed>
          <template slot-scope="scope">
            <el-row>
              <el-col :span="18" class="bg-purple">单位名称</el-col>
              <el-col :span="2" class="bg-purple">是否完成任务</el-col>
              <el-col :span="2" class="bg-purple">分数</el-col>
              <el-col :span="2" class="bg-purple">操作</el-col>
            </el-row>
            <el-row :class="['bdbottom', i1 === 0 ? 'bdtop' : '', 'vcenter']" v-for="(item1, i1) in scope.row.appraiseUnits" :key="i1">
              <!-- 渲染一级权限 -->
              <el-col :span="18" class="bg-purple">
                {{item1.deptmentname}}
              </el-col>
              <el-col :span="2" class="bg-purple">
                <el-tag v-if="item1.state===1" type="danger">未完成</el-tag>
                <el-tag v-else-if="item1.state===2" type="success">已完成</el-tag>
              </el-col>
              <el-col :span="2" class="bg-purple">
                {{item1.state}}
              </el-col>
              <el-col :span="2" class="bg-purple">
                查看详情
              </el-col>
            </el-row>
            <!-- <pre>
              {{scope.row.appraiseUnits}}
            </pre> -->
          </template>
        </el-table-column>
        <!-- 索引列 -->
        <!-- <el-table-column type="index" fixed></el-table-column> -->
        <el-table-column label="年份" prop="year" width="60px" fixed></el-table-column>
        <el-table-column label="序号" prop="serialNo" width="150px" fixed></el-table-column>
        <el-table-column label="区县" prop="area" width="60px" fixed></el-table-column>
        <el-table-column label="项目名称" prop="projectName" width="250px" fixed :show-overflow-tooltip="true"></el-table-column>
        <el-table-column label="委托金额" prop="entrustMoney" width="100px"></el-table-column>
        <el-table-column label="委托成本" prop="costMoney" width="100px"></el-table-column>
        <el-table-column label="结算金额" prop="settlementMoney" width="100px"></el-table-column>
        <el-table-column label="结算金额不含税" prop="SettlementMoneyExcludingTax" width="100px"></el-table-column>
        <!-- <el-table-column label="上家开票（万元）" prop="previousInvoicing" width="100px"></el-table-column>
        <el-table-column label="下家开票（万元）" prop="nextInvoicing" width="100px"></el-table-column> -->
        <el-table-column label="加成率%" prop="markUpRate" width="60px"></el-table-column>
        <el-table-column label="委托时间" prop="entrustTime" width="130px">
          <!-- <template slot-scope="scope2"> -->
            <!-- {{scope.row.entrustTime | dateFormat}} -->
            <!-- {{formateDate(scope2.row.entrustTime,'委托时间')}} -->
            <!-- {{scope2.row.entrustTime == null ? '' : formateDate(scope2.row.entrustTime,'委托时间')}} -->
          <!-- </template> -->
        </el-table-column>
        <el-table-column label="询价时间" prop="inquiryTime" width="130px">
         <!-- <template slot-scope="scope3">
            {{scope3.row.inquiryTime == null ? '' : formateDate(scope3.row.inquiryTime,'询价时间')}}
          </template> -->
        </el-table-column>
        <el-table-column label="合同签订时间" prop="contractSignTime" width="130px">
          <!-- <template slot-scope="scope4">
            {{scope4.row.contractSignTime == null ? '' : formateDate(scope4.row.contractSignTime,'合同签订时间（万元）')}}
          </template> -->
        </el-table-column>
        <el-table-column label="终验时间" prop="finalInspectionTime" width="130px"></el-table-column>
        <el-table-column label="结算时间" prop="settlementTime" width="130px"></el-table-column>
        <el-table-column label="维护周期（年）" prop="maintenanceCycle" width="80px"></el-table-column>
        <el-table-column label="移动项目编号" prop="mobileProjectNo" width="180px"></el-table-column>
        <el-table-column label="项目经理" prop="projectManager" width="80px"></el-table-column>
        <el-table-column label="服务经理" prop="serviceManager" width="80px"></el-table-column>
        <el-table-column label="供应商" prop="supplier" width="240px" :show-overflow-tooltip="true"></el-table-column>
        <el-table-column label="联系人" prop="contacts" width="200px" :show-overflow-tooltip="true"></el-table-column>
        <el-table-column label="委托时现场是否已完工" prop="isFinish" width="100px"></el-table-column>
        <el-table-column label="是否已交维" prop="isMaintain" width="80px"></el-table-column>
        <el-table-column label="移动过程材料" width="700px" prop="serialNo">
          <template slot-scope="scope5">
            <!-- <pre>
              {{scope5.row.fujians}}
            </pre> -->
            <!--{{pdfj(scope5.row.fujians)}}
            {{scope5.row.fujians}}
            {{isxjhe}}
            {{issjhe}}
            {{iskgbg}} -->
            <el-tag type="info" v-if="scope5.row.xjht === 0">下家合同</el-tag>
            <el-tag type="warning" v-else-if="scope5.row.xjht === 1">下家合同</el-tag>
            <el-tag color="green" style="color: #ffffff;" v-else>下家合同</el-tag>
            <el-tag type="info" v-if="scope5.row.sjht === 0">上家合同</el-tag>
            <el-tag type="warning" v-else-if="scope5.row.sjht === 1">上家合同</el-tag>
            <el-tag type="success" v-else>上家合同</el-tag>
            <el-tag type="info" v-if="scope5.row.kgbg === 0">开工报告</el-tag>
            <el-tag type="warning" v-else-if="scope5.row.kgbg === 1">开工报告</el-tag>
            <el-tag type="success" v-else>开工报告</el-tag>
            <el-tag type="info" v-if="scope5.row.dhd === 0">到货单</el-tag>
            <el-tag type="warning" v-else-if="scope5.row.dhd === 1">到货单</el-tag>
            <el-tag type="success" v-else>到货单</el-tag>
            <el-tag type="info" v-if="scope5.row.sxbg === 0">上线报告</el-tag>
            <el-tag type="warning" v-else-if="scope5.row.sxbg === 1">上线报告</el-tag>
            <el-tag type="success" v-else>上线报告</el-tag>
            <el-tag type="info" v-if="scope5.row.jgbg === 0">竣工报告</el-tag>
            <el-tag type="warning" v-else-if="scope5.row.jgbg === 1">竣工报告</el-tag>
            <el-tag type="success" v-else>竣工报告</el-tag>
            <el-tag type="info" v-if="scope5.row.zysj === 0">终验时间</el-tag>
            <el-tag type="warning" v-else-if="scope5.row.zysj === 1">终验时间</el-tag>
            <el-tag type="success" v-else>终验时间</el-tag>
            <el-tag type="info" v-if="scope5.row.yzys === 0">业主验收</el-tag>
            <el-tag type="warning" v-else-if="scope5.row.yzys === 1">业主验收</el-tag>
            <el-tag type="success" v-else>业主验收</el-tag>
            <el-tag type="info" v-if="scope5.row.gyldd === 0" :class="[yc = true]">供应链订单</el-tag>
            <el-tag type="warning" v-else-if="scope5.row.gyldd === 1">供应链订单</el-tag>
            <el-tag type="success" v-else>供应链订单</el-tag>
          </template>
        </el-table-column>
        <el-table-column label="提计应收" prop="income" width="120px"></el-table-column>
        <el-table-column label="提计实收" prop="actuallyIncome" width="120px"></el-table-column>
        <el-table-column label="入账时间" prop="incomeTime" width="130px"></el-table-column>
        <el-table-column label="录入时间" prop="createTime" width="130px">
          <!-- <template slot-scope="scope6">
            {{scope6.row.createTime == null ? '' : formateDate(scope6.row.createTime, '录入时间')}}
          </template> -->
        </el-table-column>
        <el-table-column label="操作" width="210px" fixed="right">
          <template slot-scope="scope7">
            <!-- <el-button size="mini" type="primary" icon="el-icon-edit" @click="showEditTeskDialog(scope.row.id)">编辑</el-button> -->
            <el-button size="mini" type="primary" icon="el-icon-edit" @click="addProject(scope7.row.id)">编辑</el-button>
            <el-button size="mini" type="primary" icon="el-icon-edit" @click="projectInfo(scope7.row.id)">上传附件</el-button>
          </template>
        </el-table-column>
      </el-table>
      <!-- 分页区域 -->
      <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="queryInfo.pagenum" :page-sizes="[10, 20, 50, 100, 200]" :page-size="queryInfo.pagesize" layout="total, sizes, prev, pager, next, jumper" :total="total">
      </el-pagination>
    </el-card>

    <!-- 添加任务的对话框 -->
    <!-- <el-dialog title="添加任务" :visible.sync="addTeskDialogVisible" width="50%" @close="addTeskDialogClosed" :close-on-click-modal="false">
      <el-form :model="addForm" :rules="addFormRules" ref="addFormRef" label-width="70px">
        <el-form-item label="标题" prop="title">
          <el-input v-model="addForm.title"></el-input>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="addTeskDialogVisible = false">取 消</el-button>
        <el-button type="primary" @click="addTesk">确 定</el-button>
      </span>
    </el-dialog>
 -->
    <!-- 修改任务的对话框 -->
    <!-- <el-dialog title="修改任务" :visible.sync="editTeskDialogVisible" width="50%" @close="editTeskDialogClosed">
      <el-form :model="editForm" :rules="editFormRules" ref="editFormRef" label-width="70px">
        <el-form-item label="标题" prop="title">
          <el-input v-model="editForm.title"></el-input>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="editTeskDialogVisible = false">取 消</el-button>
        <el-button type="primary" @click="editTeskInfo">确 定</el-button>
      </span>
    </el-dialog> -->
  </div>
</template>

<script>
export default {
  data() {
    return {
      // options: [{
      //     value: '2022',
      //     label: '2022'
      //   }, {
      //     value: '2021',
      //     label: '2021'
      //   }, {
      //     value: '2020',
      //     label: '2020'
      //   }, {
      //     value: '2019',
      //     label: '2019'
      //   }, {
      //     value: '2018',
      //     label: '2018'
      // }],
      // 区域
      // arealist: [{
      //     value: '温州',
      //     label: '温州'
      //   }, {
      //     value: '市本级',
      //     label: '市本级'
      //   }, {
      //     value: '鹿城',
      //     label: '鹿城'
      //   }, {
      //     value: '瓯海',
      //     label: '瓯海'
      //   }, {
      //     value: '龙湾',
      //     label: '龙湾'
      //   }, {
      //     value: '永嘉',
      //     label: '永嘉'
      //   }, {
      //     value: '洞头',
      //     label: '洞头'
      //   }, {
      //     value: '瑞安',
      //     label: '瑞安'
      //   }, {
      //     value: '乐清',
      //     label: '乐清'
      //   }, {
      //     value: '平阳',
      //     label: '平阳'
      //   }, {
      //     value: '苍南',
      //     label: '苍南'
      //   }, {
      //     value: '文成',
      //     label: '文成'
      //   }, {
      //     value: '泰顺',
      //     label: '泰顺'
      //   }, {
      //     value: '龙港',
      //     label: '龙港'
      // }],
      // 年份列表
      yearlist: [],
      // 下家合同
      isxjhe: 0,
      // 上家合同
      issjhe: 0,
      // 开工报告
      iskgbg: 0,
      // // 年份
      // year: '',
      // // 序号
      // serialno: '',
      // // 项目名称
      // projectname: '',
      // 获取用户列表的参数对象
      queryInfo: {
        // 年份
        // year: parseInt(new Date().getFullYear()),
        year: '',
        // 序号
        serialno: '',
        // 项目名称
        projectname: '',
        // 项目名称
        mobileprojectno: '',
        // 当前的页数
        pagenum: 1,
        // 当前每页显示多少条数据
        pagesize: 10
      },
      // 所有项目列表数据
      projectlist: [],
      // 控制分配权限对话框的显示与隐藏
      total: 0,
      setRightDialogVisible: false,
      // 添加任务对话框显示或隐藏
      addTeskDialogVisible: false,
      // 所有权限的数据
      rightslist: [],
      // 树形控件的属性绑定对象
      treeProps: {
        label: 'authName',
        children: 'children'
      },
      // 默认选中的节点Id值数组
      defKeys: [],
      // 当前即将分配权限的角色id
      roleId: '',
      addForm: {
        title: ''
      },
      // 添加表单的验证规则对象
      addFormRules: {
        title: [
          { required: true, message: '请输入标题', trigger: 'blur' }
        ]
      },
      // 添加任务对话框显示或隐藏
      editTeskDialogVisible: false,
      editForm: {
        title: '',
        id: '',
        createTime: ''
      },
      // 修改表单的验证规则对象
      editFormRules: {
        title: [
          { required: true, message: '请输入标题', trigger: 'blur' }
        ]
      }
    }
  },
  mounted() {
    // 定义年份列表 ，当年开始到2017年
    var nowYearList = parseInt(new Date().getFullYear())
    var yearListArr = []
    for (var i = nowYearList; i >= 2017; i--) {
      var yearObj = {}
      yearObj.value = i
      yearObj.label = i
      yearListArr.push(yearObj)
    }
    this.yearlist = yearListArr
  },
  beforeCreate() {},
  created() {
    // 页面访问权限判断
    this.menuright()
    this.getProjectsList()
  },
  methods: {
    // formateDate(row, column) {
    // var date = row[column.property]
    // if (date === undefined) {
    //   return ''
    // }
    // return moment(date).format('YYYY-MM-DD')
    // 日期格式转换
    // formateDate2(row, column) {
    //   function addzero(num) {
    //     return (num < 10 ? '0' + num : num)
    //   }

    //   if (row[column.property] !== null) {
    //     var date = new Date(row[column.property])
    //     // return date.getFullYear() + '年' + (date.getMonth() + 1) + '月' + date.getDate() + '日'
    //     return date.getFullYear() + '-' + (addzero(date.getMonth() + 1)) + '-' + addzero(date.getDate())
    //   } else {
    //     return ''
    //   }
    // },
    // 页面访问权限判断
    async menuright() {
      const { data: res } = await this.$http.get('menuright?path=' + window.location.hash.slice(2) + '&rid=' + sessionStorage.getItem('rid'))
      // console.log(res)
      if (res.meta.status === 404) {
        window.history.back()
        return this.$message.error('您无权访问该页面！已退回前一页')
      }
    },
    // 获取项目的列表
    async getProjectsList() {
      // 日期格式转换
      function formateDate(datetime) {
        function addzero(num) {
          return (num < 10 ? '0' + num : num)
        }
        if (datetime !== null) {
          // console.log(datetime)
          var date = new Date(datetime)
          // return date.getFullYear() + '年' + (date.getMonth() + 1) + '月' + date.getDate() + '日'
          return date.getFullYear() + '-' + addzero((date.getMonth() + 1)) + '-' + addzero(date.getDate())
        } else {
          return ''
        }
      }
      // 获取项目列表
      const { data: res } = await this.$http.get('projectinfo', {
        params: this.queryInfo
      })
      // console.log('查询项目参数')
      // console.log(this.queryInfo)
      // console.log('获取任务的列表')
      // console.log(res)
      if (res.meta.status !== 200) {
        return this.$message.error('获取任务列表失败！')
      }
      console.log('项目详细信息')
      console.log(res)
      // console.log('--------')
      // console.log(res.data.items)
      // 循环项目信息
      res.data.items.forEach(project => {
        // console.log('显示单个项目')
        // console.log(project)
        // this.isxjhe = 0
        // this.issjhe = 0
        // this.iskgbg = 0
        // 上家合同附件上传情况0代表没传，1代表县分传了，2代表政企部传了
        project.xjht = 0
        // 下家合同附件上传情况0代表没传，1代表县分传了，2代表政企部传了
        project.sjht = 0
        // 开工报告附件上传情况0代表没传，1代表县分传了，2代表政企部传了
        project.kgbg = 0
        // 到货单附件上传情况0代表没传，1代表县分传了，2代表政企部传了
        project.dhd = 0
        // 上线报告附件上传情况0代表没传，1代表县分传了，2代表政企部传了
        project.sxbg = 0
        // 竣工报告附件上传情况0代表没传，1代表县分传了，2代表政企部传了
        project.jgbg = 0
        // 终验证书附件上传情况0代表没传，1代表县分传了，2代表政企部传了
        project.zyzs = 0
        // 业主验收附件上传情况0代表没传，1代表县分传了，2代表政企部传了
        project.yzys = 0
        // 供应链订单附件上传情况0代表没传，1代表县分传了，2代表政企部传了
        project.gyldd = 0
        // 日期转换
        project.entrustTime = formateDate(project.entrustTime)
        project.inquiryTime = formateDate(project.inquiryTime)
        project.contractSignTime = formateDate(project.contractSignTime)
        project.finalInspectionTime = formateDate(project.finalInspectionTime)
        project.settlementTime = formateDate(project.settlementTime)
        project.incomeTime = formateDate(project.incomeTime)
        project.createTime = formateDate(project.createTime)
        // if (project.entrustTime !== null) {
        //   var date = new Date(project.entrustTime)
        //   project.entrustTime=project.entrustTime.getFullYear() + '-' + (addzero(project.entrustTime.getMonth() + 1)) + '-' + addzero(date.getDate())
        // }
        project.fujians.forEach(fujian => {
          // fujian是单个附件
          // console.log(fujian)
          // 如果附件属于下家合同
          if (fujian.fileKind === '下家合同') {
            // 如果附件属政企部的人上传管理员是1，政企部是2，县分是3
            if (fujian.rid === '1' || fujian.rid === '2') {
              project.xjht = 2
            }
            if (fujian.rid === '3') {
              project.xjht = 1
            }
          } else if (fujian.fileKind === '上家合同') {
            // 如果附件属政企部的人上传
            if (fujian.rid === '1' || fujian.rid === '2') {
              project.sjht = 2
            }
            if (fujian.rid === '3') {
              project.sjht = 1
            }
          } else if (fujian.fileKind === '开工报告') {
            // 如果附件开工报告的人上传
            if (fujian.rid === '1' || fujian.rid === '2') {
              project.kgbg = 2
            }
            if (fujian.rid === '3') {
              project.kgbg = 1
            }
          } else if (fujian.fileKind === '到货单') {
            // 如果附件到货单的人上传
            if (fujian.rid === '1' || fujian.rid === '2') {
              project.dhd = 2
            }
            if (fujian.rid === '3') {
              project.dhd = 1
            }
          } else if (fujian.fileKind === '上线报告') {
            // 如果附件上线报告的人上传
            if (fujian.rid === '1' || fujian.rid === '2') {
              project.sxbg = 2
            }
            if (fujian.rid === '3') {
              project.sxbg = 1
            }
          } else if (fujian.fileKind === '竣工报告') {
            // 如果附件竣工报告的人上传
            if (fujian.rid === '1' || fujian.rid === '2') {
              project.jgbg = 2
            }
            if (fujian.rid === '3') {
              project.jgbg = 1
            }
          } else if (fujian.fileKind === '终验证书') {
            // 如果附件终验证书的人上传
            if (fujian.rid === '1' || fujian.rid === '2') {
              project.zyzs = 2
            }
            if (fujian.rid === '3') {
              project.zyzs = 1
            }
          } else if (fujian.fileKind === '业主验收') {
            // 如果附件业主验收的人上传
            if (fujian.rid === '1' || fujian.rid === '2') {
              project.yzys = 2
            }
            if (fujian.rid === '3') {
              project.yzys = 1
            }
          } else if (fujian.fileKind === '供应链订单') {
            // 如果附件供应链订单的人上传
            if (fujian.rid === '1' || fujian.rid === '2') {
              project.gyldd = 2
            }
            if (fujian.rid === '3') {
              project.gyldd = 1
            }
          }
        })
        // console.log(item)
        // item.fujians.forEach(fujian => {
        //   fujian.abc = 1
        // })
      })
      this.projectlist = res.data.items
      this.total = res.data.total
      // console.log('projectlist简化')
      // console.log(this.projectlist)
    },
    // formateDate(datetime, sm) {
    //   console.log(sm)
    //   function addzero(num) {
    //     return (num < 10 ? '0' + num : num)
    //   }
    //   var date = new Date(datetime)
    //   // return date.getFullYear() + '年' + (date.getMonth() + 1) + '月' + date.getDate() + '日'
    //   return date.getFullYear() + '年' + (addzero(date.getMonth() + 1)) + '月' + addzero(date.getDate()) + '日'
    // },
    addProject(id) {
      this.$router.push('AddProject?id=' + id + '&act=edit')
    },
    importdata() {
      this.$router.push('ImportData')
    },
    importdata2() {
      this.$router.push('ImportData2')
    },
    projectInfo(id) {
      this.$router.push('ProjectInfo?id=' + id)
      // this.$router.push('projectinfo/' + id)
    },
    // 判断附件
    // pdfj(fujian) {
    //   if (fujian !== null) {
    //     console.log('显示附件')
    //     console.log(fujian)
    //     // this.isxjhe = 0
    //     // this.issjhe = 0
    //     // this.iskgbg = 0
    //     fujian.forEach((item) => {
    //       console.log(item)
    //       if (item.fileKind === '下家合同') {
    //         this.isxjhe = 1
    //       } else if (item.fileKind === '上家合同') {
    //         this.issjhe = 1
    //       } else if (item.fileKind === '开工报告') {
    //         this.iskgbg = 1
    //       } else if (item.fileKind === '到货单') {
    //       } else if (item.fileKind === '上线报告') {
    //       } else if (item.fileKind === '竣工报告') {
    //       } else if (item.fileKind === '终验证书') {
    //       } else if (item.fileKind === '业主验收') {
    //       } else if (item.fileKind === '供应链订单') {
    //       }
    //     })
    //     console.log(this.isxjhe)
    //     console.log(this.issjhe)
    //     console.log(this.iskgbg)
    //   }
    // },
    // addTesk() {
    //   this.$refs.addFormRef.validate(async valid => {
    //     if (!valid) return
    //     // 可以发起添加用户的网络请求
    //     const { data: res } = await this.$http.post('tesk', this.addForm)
    //     console.log(res)
    //     this.$message.success('添加任务成功！')
    //     // 隐藏添加用户的对话框
    //     this.addTeskDialogVisible = false
    //     // 重新获取用户列表数据
    //     this.getProjectsList()
    //   })
    // },
    // 监听 pagesize 改变的事件
    handleSizeChange(newSize) {
      // console.log(newSize)
      this.queryInfo.pagesize = newSize
      this.getProjectsList()
    },
    // 监听 页码值 改变的事件
    handleCurrentChange(newPage) {
      // console.log(newPage)
      this.queryInfo.pagenum = newPage
      // console.log(this.queryInfo)
      this.getProjectsList()
    }
    // async showEditTeskDialog(id) {
    //   // console.log(id)
    //   const { data: res } = await this.$http.get('tesks/' + id)

    //   if (res.meta.status !== 200) {
    //     return this.$message.error('查询任务信息失败！')
    //   }
    //   console.log('显示单条任务信息')
    //   console.log(res.data)

    //   this.editForm = res.data
    //   console.log('显示单条任务信息')
    //   console.log(this.editForm)
    //   this.editTeskDialogVisible = true
    // },
    // 监听修改任务对话框的关闭事件
    // editTeskDialogClosed() {
    //   this.$refs.editFormRef.clearValidate()
    // },
    // 修改任务信息并提交
    // editTeskInfo() {
    //   this.$refs.editFormRef.validate(async valid => {
    //     if (!valid) return
    //     // 发起修改用户信息的数据请求
    //     console.log(this.editForm)
    //     const { data: res } = await this.$http.put(
    //       'tesks/' + this.editForm.id,
    //       {
    //         title: this.editForm.title
    //       }
    //     )
    //     if (res.meta.status !== 200) {
    //       return this.$message.error('更新用户信息失败！')
    //     }

    //     // 关闭对话框
    //     this.editTeskDialogVisible = false
    //     // 刷新数据列表
    //     this.getProjectsList()
    //     // 提示修改成功
    //     this.$message.success('更新任务信息成功！')
    //   })
    // },
    // 根据Id删除对应的任务信息
    // async removeTeskById(id) {
    //   // 弹框询问用户是否删除数据
    //   const confirmResult = await this.$confirm(
    //     '此操作将永久删除该任务, 是否继续?',
    //     '提示',
    //     {
    //       confirmButtonText: '确定',
    //       cancelButtonText: '取消',
    //       type: 'warning'
    //     }
    //   ).catch(err => err)

    //   // 如果用户确认删除，则返回值为字符串 confirm
    //   // 如果用户取消了删除，则返回值为字符串 cancel
    //   console.log(confirmResult)
    //   if (confirmResult !== 'confirm') {
    //     return this.$message.info('已取消删除')
    //   }

    //   const { data: res } = await this.$http.delete('tesks/' + id)

    //   if (res.meta.status !== 200) {
    //     return this.$message.error('删除用户失败！')
    //   }

    //   this.$message.success('删除用户成功！')
    //   this.getProjectsList()
    // },
    // 通过递归的形式，获取角色下所有三级权限的id，并保存到 defKeys 数组中
    // getLeafKeys(node, arr) {
    //   // 如果当前 node 节点不包含 children 属性，则是三级节点
    //   if (!node.children) {
    //     return arr.push(node.id)
    //   }
    //   node.children.forEach(item => this.getLeafKeys(item, arr))
    // }
    // 监听添加任务对话框的关闭事件
    // addTeskDialogClosed() {
    //   this.$refs.addFormRef.resetFields()
    //   // this.defKeys = []
    // }
  }
}
</script>

<style lang="less" scoped>
.el-col {
  margin: 0px;
  padding: 10px 0;
}

.bdtop {
  border-top: 1px solid #eee;
}

.bdbottom {
  border-bottom: 1px solid #eee;
}

.vcenter {
  display: flex;
  align-items: center;
}
.yc {
  display:none;
}
// .bg-purple{
//   background: purple;
//   display: flex;
//   align-items: center;
// }
</style>
